{extend name='main'}

{block name='content'}

<style>

    .store-total-container {
        font-size: 14px;
        margin-bottom: 20px;
        letter-spacing: 1px;
    }

    .store-total-container .store-total-icon {
        top: 45%;
        right: 8%;
        font-size: 65px;
        position: absolute;
        color: rgba(255, 255, 255, 0.4);
    }

    .store-total-container .store-total-item {
        color: #fff;
        line-height: 4em;
        padding: 15px 25px;
        position: relative;
    }

    .store-total-container .store-total-item > div:nth-child(2) {
        font-size: 46px;
        line-height: 46px;
    }

    .group—info-wrap {
        display: flex;
        justify-content: center;
        justify-items: center;
    }

    .group—info-wrap .group—info-item {
        flex: 5;
        text-align: center;
    }

    .group—info-wrap .group—info-item .font-s40 {
        margin: 20px;
        font-size: 60px !important;
    }

</style>

<div class="think-box-shadow store-total-container notselect">
    <div class="margin-bottom-15">工单统计</div>
    <div class="layui-row layui-col-space15">
        <div class="layui-col-sm6 layui-col-md3">
            <div class="store-total-item nowrap" style="background:linear-gradient(-125deg,#57bdbf,#2f9de2)">
                <div>工单总量</div>
                <div>{$case_total|default=0}</div>
                <div>当前工单数量</div>
            </div>
            <i class="store-total-icon layui-icon layui-icon-template-1"></i>
        </div>
        <div class="layui-col-sm6 layui-col-md3">
            <div class="store-total-item nowrap" style="background:linear-gradient(-125deg,#ff7d7d,#fb2c95)">
                <div>未解决</div>
                <div>{$case_unsuccess_total|default=0}</div>
                <div>未解决工单数量</div>
            </div>
            <i class="store-total-icon layui-icon layui-icon-about"></i>
        </div>
        <div class="layui-col-sm6 layui-col-md3">
            <div class="store-total-item nowrap" style="background:linear-gradient(-113deg,#c543d8,#925cc3)">
                <div>延期解决</div>
                <div>{$case_oning_total|default=0}</div>
                <div>已延期解决工单数量</div>
            </div>
            <i class="store-total-icon layui-icon layui-icon-read layui-icon-log"></i>
        </div>
        <div class="layui-col-sm6 layui-col-md3">
            <div class="store-total-item nowrap" style="background:linear-gradient(-141deg,#ecca1b,#f39526)">
                <div>已解决</div>
                <div>{$case_success_total|default=0}</div>
                <div>已解决工单数量</div>
            </div>
            <i class="store-total-icon layui-icon layui-icon-survey layui-icon-face-smile-fine"></i>
        </div>
    </div>
</div>

{if auth("worksheet/group/index")}
<div class="think-box-shadow store-total-container">
    <div class="margin-bottom-15">团队工单统计</div>
    <div class="layui-row layui-col-space15 group—info-wrap">
        <div class="group—info-item">
            <div class="font-s40" style="color: grey;">{$group_user_total|default=0}</div>
            <div class="font-s14">团队成员数</div>
        </div>
        <div class="group—info-item">
            <div class="font-s40" style="color: green;">{$group_case_total|default=0}</div>
            <div class="font-s14">团队工单总数</div>
        </div>
        <div class="group—info-item">
            <div class="font-s40" style="color: red;">{$group_case_unsuccess_total|default=0}</div>
            <div class="font-s14">团队未解决工单数</div>
        </div>
        <div class="group—info-item">
            <div class="font-s40" style="color: orange;">{$group_case_oning_total|default=0}</div>
            <div class="font-s14">当前延期处理工单数</div>
        </div>
        <div class="group—info-item">
            <div class="font-s40" style="color: blue">{$group_case_success_total|default=0}</div>
            <div class="font-s14">团队已解决工单数</div>
        </div>
    </div>
</div>
{/if}
{/block}
